<template>
    <Modal v-model="show" title="在线商品设置" :closable="false" :mask-closable="false" @on-visible-change="showModal" :width="1200">
        <el-row style="margin-bottom:10px">
            <label>库存：</label>
            <el-input size="small" type="number" v-model="params.stock" style="width:120px;">
            </el-input>
            <el-button size="small" type="danger" @click="batchSet">批量填写</el-button>
            <el-button size="small" @click="batchPreOrder" type="warning">全部预售/现货</el-button>
            <el-button size="small" @click="batchModify" type="primary">全部修改库存</el-button>
        </el-row>
        <div v-loading="loading" style="min-height:300px">
            <div v-for="(sid,ind) in products" :key="ind">
                <el-card class="box-card" v-loading="sid.loading" style="margin-bottom:10px">
                    <div slot="header" style="white-space:nowrap;overflow:hidden;
text-overflow:ellipsis;font-size: 16px;color: #ff0000">
                        店铺：<a target="_blank" :href="genShopUrl(sid.country,sid.shopId)">{{sid.shopName}}</a>
                    </div>
                    <div class="pitem">商品：<a target="_blank" :href="genUrl(sid.country,sid.shopId,sid.itemId)">{{sid.itemName}}</a></div>
                    <div class="pitem">属性：{{sid.variationName}}</div>
                    <div class="pitem">
                        <label>库存：</label>
                        <el-input size="small" type="number" v-model="sid.stock" style="width:120px;">
                        </el-input>
                        <el-button size="small" type="danger" :loading="sid.loading" @click="handlerModify(sid)">提交修改</el-button>
                        <span style="margin-left: 10px">{{sid.errorInfo}}</span>
                        <el-button @click="batchPreOrderSingle(sid)" size="small" style="float:right" type="primary">预售/现货</el-button>
                    </div>
                    </el-descriptions>
                </el-card>
            </div>
        </div>
        <CBatchPreOrder ref="dialogPreOrder" @callback="preOrderCallback"></CBatchPreOrder>
    </Modal>
</template>
<script>
import CBatchPreOrder from "@/components/Product/CBatchPreOrder.vue"
export default {
    name: 'StorageProduct',
    data() {
        return {
            type: 1,
            params: {
                stock: 0
            },
            products: [],
            show: false,
            loading: false,

        };
    },
    mounted: function() {

    },
    components: {
        CBatchPreOrder
    },
    props: [],
    methods: {
        batchModify() {
            this.products.forEach((item, ind) => {
                this.handlerModify(item);
            });
        },
        handlerModify: function(item) {
            if (item.loading) return;
            let data = {
                shopId: item.shopId,
                items: [],
                is2tierItem: false,
                stock: item.stock,
                itemId: item.itemId,
            };
            if (item.variationId && item.variationId > 0) {
                data.items.push({
                    itemId: item.itemId,
                    variationId: item.variationId,
                    stock: item.stock
                });
            }
            var params = JSON.stringify(data);
            item.loading = true;
            this.$http.post("/xiapiproduct/batchStock.do", { data: params }).then(
                response => {
                    item.loading = false;
                    if (response.status == 0) {
                        item.errorInfo = "修改成功";
                    } else {
                        item.errorInfo = response.info;
                        this.errorMessage(response.info);
                    }
                }, response => {
                    this.errorMessage("网络请求异常");
                    item.loading = false;
                });
        },
        batchPreOrder: function() {
            if (this.products.length <= 0) {
                return;
            }
            this.type=1;
            this.$refs['dialogPreOrder'].showDialog();
        },
        batchPreOrderSingle: function(ite) {
            this.type=2;
            this.product=ite;
            this.$refs['dialogPreOrder'].showDialog();
        },
        preOrderCallback: function(daytoship) {
            if (this.type == 1) {
                this.products.forEach((item, index) => {
                    this.hanlderPreOrder(item, { isPreOrder: daytoship.is_pre_order, daysToShip: daytoship.days_to_ship });

                });
            } else {
                this.hanlderPreOrder(this.product, { isPreOrder: daytoship.is_pre_order, daysToShip: daytoship.days_to_ship });
            }
        },
        hanlderPreOrder: function(item, params) {

            item.loading = true;
            let tps = { "isPreOrder": params.isPreOrder, "daysToShip": params.daysToShip };
            tps['shopId'] = item.shopId;
            tps['itemId'] = item.itemId;
            this.$http.post("/xiapiproduct/batchPreOrder.do", tps).then(response => {
                var body = response;
                item.loading = false;
                if (body.status == 0) {
                    this.$set(item, "errorInfo", "修改成功！");
                } else {
                    this.errorMessage(body.info);
                }

            }, response => {
                item.loading = false;
            });
        },
        batchSet: function() {
            this.products.forEach((item, ind) => {
                this.$set(item, "stock", this.params.stock);
            });
        },
        showDialog(productId) {
            this.productId = productId;
            this.show = true;
        },
        showModal(val) {
            if (val) {
                this.getProductList();
            } else {

            }
        },
        getProductList: function() {
            var me = this;
            me.loading = true;
            me.$http.post("/storageproduct/getRelative.do", {
                productId: me.productId
            }).then(response => {
                var body = response;
                if (body.status == 0) {
                    me.products = body.obj;
                    me.products.forEach((item, ind) => {
                        me.$set(item, "stock", 0);
                        me.$set(item, "loading", false);
                    });

                }
                me.loading = false;
            }, response => {
                me.loading = false;
            });

        },
        cancel: function() {
            this.show = false;
            this.$emit("cancel");
        }
    }
}
</script>